<template>
  <div class="container">
    <div class="head-top">
      <span>推荐码</span>
      <img @click="$router.push({name:'My',params:{index:4}})" src="static/img/w-left.png" />
    </div>
    <div class="content">
      <div class="my-invite">
        我的邀请码
      </div>
      <div class="address">
        <span id="address">144</span>
        <div id="getHash" type="default" data-clipboard-target="#address" @click="copy">复制</div>
        </div>
      <div class="codeBox">
        <canvas id="QRCode" ref="QRCode" style="width:9.375rem;height:9.375rem"></canvas>
      </div>
      <div class="inp">
        <input type="text" placeholder="输入邀请人推荐码">
      </div>
      <div class="word">（用于向输入的邀请码用户发放奖励）</div>
      <div class="submit">确定</div>
    </div>
  </div>
</template>


<script>
import Clipboard from "clipboard";
import { Dialog } from "vant";
import { mapGetters, mapActions } from "vuex";
import accountUtils from "../../service/eth/accountUtils";

export default {
  components: {},
  data() {
    return {
      symbol: this.$route.params.symbol,
    };
  },

  computed: {
    ...mapGetters(["currentAccount", "wallet", "accountIndex"]),
  },
  methods: {
    ...mapActions(["setWallet", "setAccountIndex"]),
    returnPage() {
      if (this.symbol == "ETH" || this.symbol == "ether") {
        if (this.$route.params.path == "index") {
          this.$router.back();
        } else {
          this.$router.push({ name: "Transaction", params: { symbol: "ETH" } });
        }
      } else {
        this.$router.push({
          name: "TransactionERC",
          params: {
            symbol: this.$route.params.symbol,
            coin: this.currentAccount.currentCoin,
          },
        });
      }
    },
    copy() {
      new Clipboard("#getHash", {
        text: function (trigger) {
          Dialog.alert({
            title: "提示",
            message: "已成功复制到剪切板",
          }).then(() => {});
          return trigger.getAttribute("href");
        },
      });
    },
  },
  mounted() {
    console.log(this.currentAccount.address)
    accountUtils.generatePublicKeyQrCode("QRCode", this.currentAccount.address);
    // this.$refs.QRCode.style.width = "3rem";
    // this.$refs.QRCode.style.height = "3rem";
  },
};
</script>
<style lang="less" scoped>
@import url("../../assets/css/Invite.less");
</style>

